<!DOCTYPE html>
<html>

	<head>
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
		<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="format-detection" content="telephone=no" />
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta content="black" name="apple-mobile-web-app-status-bar-style">
		<link href="css/SYSFrame.css" rel="stylesheet" type="text/css" />
		<link href="font/iconfont.css" rel="stylesheet" type="text/css" />
		<link href="css/module.css" rel="stylesheet" type="text/css" />
		<link href="css/pages.css" rel="stylesheet" type="text/css" />
		<title>单页</title>
		<script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>
		<script src="js/template.js" type="text/javascript"></script>
		<script src="js/jquery.nicescroll.js" type="text/javascript"></script>
		<script src="js/HUpages.js" type="text/javascript"></script>
	</head>
    
	<body id="pagestyle" class="pagestyle">
		<!--左侧菜单栏-->
		<div class="bk-con-menu " id="bk-con-menu">
			<div class="menubtn">
				<span class="close_btn samebtn"><i>隐藏</i></span>
				<span class="show_btn samebtn"><i>显示</i></span>
			</div>
			<div class="title-menu">栏目分类</div>
			<div class="breadcrumb" id="breadcrumb">
				<ul class="clearfix menu-section sortList" id="sortList">

				</ul>
			</div>
		</div>
		<div class="bk-con-message message-section" id="iframe_box">
			<div class="page_content mb15clearfix">
				<ul class="menulist Article-ope clearfix">
					<li class="column-name l_f">
						<a href="javascript:void(0)" class="btn button_btn btn-danger" onclick=""><i class="iconfont">&#xe6b4</i>&nbsp;批量删除</a>
					</li>
					<li class="column-name l_f">
						<a href="javascript:void(0)" title="添加文章" class="btn button_btn bg-deep-blue menuUl_title" name="add_article.html" data-id="46"><i class="iconfont">&#xe61a</i>添加文章</a>
					</li>
				</ul>
				<div class="Single_page clearfix">
					<ul class="Single_page_list" id="Single_pageLsit">
					</ul>
				</div>
			</div>
		</div>
	</body>
	<script id="sorthtml" type="text/html">
		<% for(var i = 0; i < sorts.length; i++) { %>
		<li class="sort-name">
			<a href="javascript:void(0)" data-id="<%=sorts[i].id%>" class=" active">
				<%=sorts[i].name%>(
				<%=sorts[i].quantity%>)</a>
		</li>
		<% } %>
	</script>
	<script id="listhtml" type="text/html">
		<% for(var i = 0; i < list.length; i++) { %>
		<li class="page_list_content">
			<a href="#" class="link_name" title="<%=list[i].title%>"></a>
			<a href="javascript:void(0)" onclick="page_delete(this,'<%=list[i].id%>')" class="page_delete  display Single_operate"><i class="iconfont">&#xe627</i></a>
			<a href="javascript:void(0)" onclick="page_modify(this,'<%=list[i].id%>')" class="page_modify  display Single_operate"><i class="iconfont">&#xe61a</i></a>
			<div class="title_name">
				<% if(list[i].status==0) {%>
				<div class="wrap"><span class="ribbon5 pro-type" data-id="0">关闭</span></div>
				<%} if(list[i].status==1) {%>
				<div class="wrap"><span class="ribbon6 pro-type" data-id="1">显示</span></div>
				<%}%>
				<%=list[i].title%>
			</div>
			<div class="page_info">
				<%=list[i].explain%>
			</div>
			<div class="time"><span class="l_f ml10 colorgreen">
       <% for(var s = 0; s < sort.length; s++) { %>
            		<% if(sort[s].id==list[i].sort) {%>
            			    <%=sort[s].name%>
            			<%}%>
                <% } %></span>
				<%=timestamp(list[i].time,'yyyy-MM-dd hh:mm')%>
			</div>
		</li>
		<% } %>
	</script>
	<script>
		//内页框架
		$(function() {
			$("#pagestyle").Hupage({
				slide: '#breadcrumb',
				padding: 15,
				menuModule: '#bk-con-menu', //菜单模块
				pagecontent: '.page_content', //自定义属性
				scrollbar: function(e) {
					e.niceScroll({
						cursorcolor: "#dddddd",
						cursoropacitymax: 1,
						touchbehavior: false,
						cursorwidth: "3px",
						cursorborder: "0",
						cursorborderradius: "3px",
					});
				},
				expand: function(thisBox, settings) {
					var pc = "";
					$(settings.pagecontent).css("margin-bottom") != null ? pc = parseInt($(settings.pagecontent).css("margin-bottom").replace("px", "")) : '';
					$(settings.pagecontent).css({
						height: $(window).height() - pc - (settings.padding * 2)
					})
					settings.scrollbar($(settings.slide) && $(settings.pagecontent));
				}
			});
		});
		//获取数据	
		function articlelist() {
			var loadMore = function(callback) {
				$.ajax({
					url: "json/pages.json",
					type: "GET",
					dataType: 'json',
					success: function(ret) {
						typeof callback == 'function' && callback(ret);
					},
				});
			};
			loadMore(function(listArr) {
				var articlehtml = $('#Single_pageLsit');
				var sortListhtml = $('#sortList');
				var shtml = template('sorthtml', {
					sorts: listArr.Sort
				});
				sortListhtml.append(shtml);
				var Column = $('#sortList li.sort-name');
				index = 0;
				Column.eq(index).addClass('active');
				var sortid = Column.eq(index).find('a').attr('data-id');
				for(var i = 0, len = Column.length; i < len; i++) {
					Column.find('a').on('click', function(e) {
						var id = $(this).attr('data-id');
						if(id == 0) {
							articlehtml.html('');
							var html = template('listhtml', {
								list: listArr.data,
								sort: listArr.Sort
							});
							articlehtml.append(html);
						} else {
							var list = listArr.data;
							for(var c = 0, len = list.length; c < len; c++) {
								var menu_node1 = list.filter(function(e) {
									return e.sort == id;
								});
								if(menu_node1 != "") {
									articlehtml.html('');
									var html = template('listhtml', {
										list: menu_node1,
										sort: listArr.Sort
									});
									articlehtml.append(html);
								} else {
									articlehtml.html('<div class="bare_prompt">还没有相关文章</div>');
								}
							}
						}
						for (var c = 0, len = Column.length; c < len; c++) {
							Column.eq(c).removeClass('active');
							$(this).parent().addClass('active')
					}
					});
				}
				var html = template('listhtml', {
					list: listArr.data,
					sort: listArr.Sort
				});
				articlehtml.append(html);
				var status = articlehtml.find('.page_list_content');
				for(var i = 0; i < status.length; i++) {
					var statusid = articlehtml.find('.name_status').eq(i).attr('data-id');
					if(statusid != 1) {
						articlehtml.find('.name_status').eq(i).addClass('statusNO');
					}
				}
			});
		}
		articlelist();
		//删除
		function page_delete(e, id) {
			var loadMore = function(callback) {
				$.ajax({
					url: "json/pages.json",
					type: "GET",
					dataType: 'json',
					success: function(ret) {
						typeof callback == 'function' && callback(ret);
					},
				});
			};
			loadMore(function(listArr) {
				var lists = listArr.data;
				for(var i = 0; i < lists.length; i++) {
					var j = lists[i];
					if(j.id == id) {
						lists.splice(i, 1);
						var articlehtml = $('#Single_pageLsit');
						articlehtml.html('');
						var html = template('listhtml', {
							list: lists,
							sort: listArr.Sort
						});
						articlehtml.append(html);
					}
				}
			})
		}
		//修改
		function page_modify(e, id) {

		}
	</script>
	<script type="text/javascript" src="js/common.js" ></script>